// pages/article/article.js
Page({

	/**
	 * 页面的初始数据
	 */
	data: {
		imageMode: "aspectFill",
		articleData: [],
		// 默认图片高度500rpx
		imageHeight: "height: 500rpx"
	},

	/**
	 * 生命周期函数--监听页面加载
	 */
	onLoad: function(options) {
		//获取传过来的 文章id
		// console.log(options.id)
		var _this = this
		// 1. 获取数据库引用
		const db = wx.cloud.database()
		//设置 _ 命令
		const _ = db.command
		// 2. 构造查询语句
		// ==查不到数据==检查云端集合权限,检查权限,检查权限==
		db.collection('article')
			.doc(options.id)
			.get()
			.then(res => {
				// console.log(res.data)
				var tempData = [].concat(res.data);
				if (res.data) {
					console.log(res.data)
					_this.setData({articleData: res.data})
					// console.log(_this.data.articleData)
					
					//获取首图的宽高比 并根据不同宽高比 来设置轮播的高度
					//getImageInfo 是获取图片宽高,实际上也可以通过获取image元素的宽高来实现
					wx.getImageInfo({
						//首图的路径
					  src: _this.data.articleData.images[0],
					  success (res) {
							// res.width res.height
							if((res.width / res.height) <= 1.35){
								// 3:2的图 宽高比是1.5, 小于1.35 就稍微接近正方形了,就把宽度设置为750rpx
								_this.setData({imageHeight: "height: 750rpx"})
								//显示方式为 widthFix
								_this.setData({imageMode: "widthFix"})
								// console.log(_this.data)
								console.log("图片宽高比:",res.width / res.height,"小于等于1.35")
							}else{
								_this.setData({imageHeight: "height: 500rpx"})
								_this.setData({imageMode: "aspectFill"})
								// console.log(_this.data)
								console.log("图片宽高比:",res.width / res.height,"大于1.35")
							}
					  },
						fail: err=>{console.log(err)}
					})
					
				} else {
					wx.showToast({
						title: "加载失败,请返回重试",
						icon: "none"
					})
				}
			})
			.catch(err => {
				console.error(err)
			})

	},

	/**
	 * 生命周期函数--监听页面初次渲染完成
	 */
	onReady: function() {
		
	},

	/**
	 * 生命周期函数--监听页面显示
	 */
	onShow: function() {

	},

	/**
	 * 生命周期函数--监听页面隐藏
	 */
	onHide: function() {

	},

	/**
	 * 生命周期函数--监听页面卸载
	 */
	onUnload: function() {

	},

	/**
	 * 页面相关事件处理函数--监听用户下拉动作
	 */
	onPullDownRefresh: function() {

	},

	/**
	 * 页面上拉触底事件的处理函数
	 */
	onReachBottom: function() {

	},

	/**
	 * 用户点击右上角分享
	 */
	onShareAppMessage: function() {

	}
	
})
